<script setup lang="ts">
import { messageStore } from '@/store/message';
const leftBack = () => history.back();
const store: any = messageStore();
store.getSystemMessageList();
</script>
<template>
  <van-nav-bar title="系统消息" left-arrow @click-left="leftBack" />
  <dl>
    <dt v-for="(item, index) in store.systemMessageList" :key="index">
      <h3>
        {{ item.title }}<span>{{ item.specific_time }}</span>
      </h3>
      <p>{{ item.content }}</p>
      <router-link :to="'/message/systemDetails/' + item.id">点击查看 ></router-link>
    </dt>
  </dl>
</template>
<style scoped>
dl {
  padding: 0.64rem;
  background: #f9f9f9;
  height: calc(100vh - 46px - 1.28rem);
  overflow: auto;
}
dt {
  background: #ffffff;
  border-radius: 0.27rem;
  margin-bottom: 0.59rem;
  padding: 0.88rem 0.5rem;
  text-align: center;
}
dt h3 {
  font-size: 0.8rem;
  line-height: 0.8rem;
  font-weight: 400;
  color: #333333;
  display: flex;
  align-items: center;
}
dt h3 span {
  flex: 1;
  text-align: right;
  font-size: 0.69rem;
  line-height: 0.69rem;
  font-weight: 400;
  color: #999999;
}
dt p {
  font-size: 0.69rem;
  font-weight: 300;
  color: #666666;
  line-height: 1.23rem;
  text-align: left;
  border-top: 1px solid #eeeeee;
  border-bottom: 1px solid #eeeeee;
  padding: 1.07rem 0;
  margin-top: 0.8rem;
  margin-bottom: 0.83rem;
}
dt a {
  font-size: 0.75rem;
  line-height: 0.75rem;
  font-weight: 300;
  color: #666666;
}
</style>
